[OS X] 透過型のTwitterクライアントを作ってみた

[OS X] 透過型のTwitterクライアントを作ってみた

Clock Icon2016.07.05

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

1 はじめに

今回は、Macで動作する透明のTwitterクライアントを作ってみました。

001

作成した目的は、セッション中などにプレゼン資料の上で表示したかったからです。

002

記事内でも説明は致しますが、詳しくは、下記のコードをご参照ください。


github [GitHub] 透明のTwitterクライアント

2 STTwitter

Twitterのデータ取得には、STTwitterを使用させて頂きました。
https://github.com/nst/STTwitter

使用方法は、Github上のREADMEや、デモコードの中に詳しく記載されており、非常に簡単に利用できます。

下記は、その主要な部分です。カスタマーキー・カスタマーシークレット・ユーザ名・パスワードで認証して、queryで指定した文字列を検索しています。

STTwitterAPI *_twitter = [STTwitterAPI twitterAPIWithOAuthConsumerKey:ConsumerKey
                                                       consumerSecret:ConsumerSecret
                                                             username:UserName
                                                             password:Password];
    [_twitter fetchAndFollowCursorsForResource:@"search/tweets.json"
                                    HTTPMethod:@"GET"
                                 baseURLString:@"https://api.twitter.com/1.1"
                                    parameters:@{@"q":query}
                           uploadProgressBlock:nil
                         downloadProgressBlock:nil
                                  successBlock:^(id request, NSDictionary *requestHeaders, NSDictionary *responseHeaders, id response, BOOL morePagesToCome, BOOL *stop) {
                                      // 検索結果の正常受信
                                      NSDictionary *json = (NSDictionary *)response;
                                  } pauseBlock:^(NSDate *nextRequestDate) {
                                      // ロード中
                                  } errorBlock:^(id request, NSDictionary
                                   // エラー
                                  }];

 

3 ウインドウ

透明のWindowは、色々と扱いにくいので、アプリケーションを常に最前面に表示するようにして、非アクティブになった時だけ透過するようにしました。 なので、アクティブにすると、普通のアプリのように、拡大縮小や位置の変更などが可能になります。

003

(1) 最前面表示

ウインドウを常に最前面に置くためのコードは、次のとおりです。

- (void)applicationDidFinishLaunching:(NSNotification *)aNotification {
    // ウインドウ最前面
    NSWindow *window = [[NSApp windows]objectAtIndex:0];
    [window setCollectionBehavior:NSWindowCollectionBehaviorCanJoinAllSpaces | NSWindowCollectionBehaviorFullScreenAuxiliary];
    [window setLevel: NSFloatingWindowLevel];
}

(2) ウインドウ透過

透明のウインドウ(NSWindow)は、setBackgroundColorで背景色をclearColor(透過)にセットし、併せてsetOpaque及び、setHasShadowNOに設定することで作成することができます。

ただし、その上に存在する全てのビューも同時に透過に設定する必要があります。 本プログラムでは、テーブルビュー及びその下に存在するすスクロールビューも透過す設定しています。

- (void)viewDidLoad {

    ・・・省略・・・

    // ウインドウ透明
    NSWindow *window = [[NSApp windows]objectAtIndex:0];
    [window setOpaque:NO];
    [window setBackgroundColor : [ NSColor clearColor ]];
    [window setHasShadow:NO];

    _scrollView.drawsBackground = NO;
    [_tableview setBackgroundColor:[NSColor clearColor]];
    [_tableview setHeaderView:nil];
    self.view.alphaValue = 0;

そして、プログラムがアクティブになった時と、非アクティブになった時に、次の処理を入れています。

// プログラムがアクティブになった時
- (void)applicationWillBecomeActive:(NSNotification *)notification{
    NSLog(@"willBecomeActive");

    NSWindow *window = [[NSApp windows]objectAtIndex:0];
    [window setStyleMask:NSTitledWindowMask|NSResizableWindowMask|NSClosableWindowMask];// タイトル表示
    [window setBackgroundColor : [ NSColor lightGrayColor ]];
}

// プログラムが非アクティブになった時
- (void)applicationWillResignActive:(NSNotification *)notification{
    NSLog(@"willResignActive");

    NSWindow *window = [[NSApp windows]objectAtIndex:0];
    [window setStyleMask:NSBorderlessWindowMask];// タイトル非表示
    [window setBackgroundColor : [ NSColor clearColor ]];
}

(3) フォントの拡大縮小

最終的な目的が、プレゼン資料の上での表示なので、会場で文字が読める大きさであるかどうかは重要な問題です。 できるだけ沢山のTweetを表示して、かつ、見やすい大きさに調整できるように、キー操作でフォントの拡大縮小ができるようになっています。

005

006

// キー入力でフォントの拡大・縮小を行う
- (void)keyDown:(NSEvent *)theEvent
{
    switch([[theEvent characters] characterAtIndex:0])
    {
        case '+': // フォント拡大
            self.fontSize += 1;
            break;
        case '0': // フォント縮小
            self.fontSize -= 1;
            break;
    }
    [_tableview reloadData];
}

4 最後に

今回は、透過型アプリの作成となりましたが、予想以上に美しい出来栄えで、ビックリしています。 また、何か他のものにも挑戦してみたいと思いました。

Share this article

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.